<template>
  <div class="execution">
    <basic-container>
      <div style="margin-top: 10px">
        <el-table
          :data="list"
          border
          :header-cell-style="{ color: '#4D4D4D', background: '#fafafa' }"
        >
          <el-table-column
            label="订单编号"
            align="center"
            show-overflow-tooltip
            prop="orderSn"
          ></el-table-column>
          <el-table-column
            label="支付金额"
            align="center"
            prop="payAmount"
          ></el-table-column>
          <el-table-column label="会员级别类型" align="center" prop="type">
            <template slot-scope="scope">
              <p>{{ scope.row.type | typeFilters }}</p>
            </template>
          </el-table-column>
          <el-table-column label="收益金额" align="center" prop="amount">
          </el-table-column>
          <el-table-column
            label="下单人账号"
            align="center"
            prop="personAccount	"
          ></el-table-column>
          <el-table-column
            label="收益会员账号"
            align="center"
            prop="memberAccount"
          ></el-table-column>
        </el-table>
      </div>
      <div class="pagination-container">
        <el-pagination
          background
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          layout="total, sizes,prev, pager, next,jumper"
          :page-size="listQuery.size"
          :page-sizes="[5, 10, 15]"
          :current-page.sync="listQuery.current"
          :total="total"
        >
        </el-pagination>
      </div>
    </basic-container>
  </div>
</template>
<script>
import "@/styles/index.scss";
import { listMemberIncomeDtl } from "@/api/profit/member/index";

const defaultListQuery = {
  current: 1,
  size: 10,
  memberId: null
};

export default {
  data() {
    return {
      options: [],
      listQuery: Object.assign({}, defaultListQuery),
      list: [],
      total: 0,
    };
  },
  created() {
    this.listQuery.memberId = this.$route.query.memberId;
    this.getList();
  },
  filters: {
    typeFilters(value) {
      if (value === 1) {
        return "一级";
      } else if (value === 2) {
        return "二级";
      }
    }
  },
  methods: {
    handleSizeChange(val) {
      this.listQuery.size = val;
      this.getList();
    },
    handleCurrentChange(val) {
      this.listQuery.current = val;
      this.getList();
    },
    getList() {
      listMemberIncomeDtl(this.listQuery).then((res) => {
        this.list = res.data.data.records;
        this.total = res.data.data.total;
      });
    },
    handleResetSearch() {
      this.listQuery = Object.assign({}, this.defaultListQuery);
    },
  },
};
</script>